Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
JavaScript DOM Game Blackjack JavaScript Game from Scratch
Highest Rated
Rating: 4.9 out of 5(11 ratings)
150 students
Created byLaurence Svekis
Last updated 11/2024
English

What you'll learn

  • how to apply JavaScript to create DOM based Game
  • JavaScript coding
  • Update and manipulate web page element using JavaScript

Course content

2 sections50 lectures2h 51m total length
  • Introduction to JavaScript BlackJack game2:22
  • Web Developer Setup HTML.2:28
  • HTML Source Code0:03
  • Get coding JavaScript5:17
  • Source Code0:04
  • DOMContentLoaded run app code4:19
  • JavaScript App Source Code0:07
  • Game Variables Element Building8:21
  • Source JS0:06
  • Remove HTML only JavaScript8:32
  • Create Elements JavaScript Source0:14
  • HTML buttons with JavaScript8:50

    Learn to build a blackjack-style game UI by creating and appending DOM elements with JavaScript, including a dashboard, status messages, deal, hit, stand buttons, and a bet input.

  • Source Code JS document maker0:28
  • Deck of Cards.8:57
  • Source Code0:45
  • Shuffle Deck of Cards.5:11

    Learn to shuffle a deck of cards by sorting an array in place, and using a compare function or math.random to randomize order, with practical deck examples.

  • Source Code Sort Random0:12
  • Add Event listeners to Buttons.4:13

    Connect the existing game buttons to click listeners, implement deal, hit, stand, and next card functions, manage dealer and player hands, and toggle button availability as the game starts.

  • Button Toggle On Off.2:38
  • Source Code Event Listeners0:56
  • Dealing of Cards4:03
  • Source Code0:06
  • Show card on WebPage7:28

    Show a card on a web page by building a showCard function that creates DOM elements, styles color by suit, and displays rank and suit for dealer and player.

  • Source Code1:12
  • Element CSS4:50
  • CSS Source Code0:17
  • Hide Top Card4:01

    Learn to hide the dealer's top card by overlaying a cover on the card back, toggle visibility with a boolean, and ensure a fresh deck is built when empty.

  • Source Code1:15
  • Begin Game Play Conditions Part 1.6:26
  • Source Code0:09
  • Begin Game Play Conditions part 27:50
  • Source Code1:40
  • Add Game Player options3:42
  • Source Code1:42
  • Dealer Playing Game3:57
  • Source Code1:45
  • Find the Game Winner5:52
  • Source Code1:59
  • Game Tweaks and Adjustments.4:25
  • Source Code2:04
  • Game Bets and scoring7:13
  • Source Code2:16
  • GamePlay Updates.6:33
  • Source Code JS2:30
  • Final Updates3:20
  • Final JS Source Code2:32
  • Final Code Review10:32

    Review and refine a blackjack game built in JavaScript from scratch, including deck creation, shuffling, dealing, ace scoring, and betting, with a self-contained app object and dynamic DOM updates.

Requirements

  • HTML and CSS
  • Basic JavaScript core fundamentals
  • Computer access
  • Programming expereince

Description

Explore how you can create a JavaScript DOM based game from scratch using JavaScript

Update and manipulate web page element with JavaScript Code - No libraries No tricks all JavaScript

This course focuses on JavaScript

  • Create elements and add them to your web page using JavaScript - Yes loaded with examples and way to do this easily.

  • Add event listeners to create interactive content using JavaScript

  • Dynamic content and interactions updating web page elements

  • Do more with JavaScript - Learn to apply JavaScript best of all while build a FUN INTERACTIVE GAME

  • Blackjack game - Easy to create with simple rules

  • Create visual cards using CSS

  • Apply styles, classes and interactions to elements

Step by step learning - everything you need to create YOUR OWN VERSION OF THIS GAME!!!!

Learn how to add functions that run the code in sequence to make a game

Learn more about game design along the way

Taught by an instructor with many years of REAL WORLD web development experience - READY to HELP YOU LEARN

Fast friendly support is always available within the Q&A section

What are you waiting for - you have nothing to lose!!!

BUILD YOUR OWN VERSION of the GAME TODAY!!!!

Source code is included step by step so you can copy the code try it out and get a feel for what JavaScript is doing.


Who this course is for:

  • JavaScript developers
  • Application developers
  • Anyone who wants to create a project with JavaScript